flexboxを使ってsticky headerを作る
code:css
.container {
display: flex;
flex-direction: column;
height: 100vh;
width: 100vw;
}
header {}
main {
flex-grow: 1;
overflow-y: scroll;
}
flex-grow
を指定
https://codepen.io/mrsekut/pen/xxJrojW?editors=1100
参考
position: fixed;を使わずにヘッダー/フッターを固定する方法【FlexBox解説】